import type { SogouElements } from '../../../../../../../../types/constants/personalization/sogou'
import { ThemeVarService } from '../../../../../../../../lib/abstract/style/theme_var/service'
import { PAGE_ELEMENTS, SUPPORTED_PLATFORMS } from '../../../../../../../../types/constants'
import { PageBaseStyles } from '../../../base'
import { SearchCommonStyles } from '../../common'

export class SogouMorePage {
  elements: SogouElements = PAGE_ELEMENTS[SUPPORTED_PLATFORMS.SO_GOU]
  private static instance: SogouMorePage
  private readonly themeVarService: ThemeVarService = ThemeVarService.getInstance()
  private readonly pageBaseStyles: PageBaseStyles = PageBaseStyles.getInstance()
  private readonly searchCommonStyles: SearchCommonStyles = SearchCommonStyles.getInstance()

  /**
   * 获取单例实例
   */
  public static getInstance(): SogouMorePage {
    if (!SogouMorePage.instance) {
      SogouMorePage.instance = new SogouMorePage()
    }
    return SogouMorePage.instance
  }

  init(): void {
  }

  /**
   * 无搜索结果样式
   */
  noSearchResult(): string {
    return ``
  }

  getMainStyles(): string {
    return `
/* 主内容 */
#wrapper {
  #header {
    /* 搜索框 */
    .s-input-box {
      background-color: #ffffff !important;
    }
  }

  .pro-list {
    /* 产品分类 */
    .pl-tit {
      border-bottom: none !important;
      color: var(${this.themeVarService.em.text}) !important;
      
      span {
        ${this.pageBaseStyles.titleStyles({ includeTag: true })}
        padding-bottom: 0 !important;
      }
    }
    
    /* 产品列表 */
    .productlist {
      ${this.searchCommonStyles.resultContainerStyles({ columns: 3 })}
      justify-content: flex-start !important;
      gap: 10px !important;
      
      li {
        ${this.searchCommonStyles.resultItemStyles({ setPadding: false })}        
        ${this.pageBaseStyles.listItemHoverStyles()}
        
        a {
          color: var(${this.themeVarService.default.text.secondary}) !important;
          
          h3 {
            color: var(${this.themeVarService.link.default.text}) !important;
          }
        }
      }
    }
  }
}

/* 页脚 */
.cr {
  background-color: var(${this.themeVarService.default.background.base}) !important;
  
  a {
    color: var(${this.themeVarService.link.default.text}) !important;
    
    &:hover {
      color: var(${this.themeVarService.link.default.textHover}) !important;
      text-decoration: none !important;
    }
  }
}
`
  }
}
